<template>
	<div class="HomeIndex">
		<div class="container">
		  	<div class='headImg'>
			    <div class='background'></div>
			    <div class='background_blank'></div>
			    <div class='head'>
			    	<div class="image"></div>
			    	<img  class="userinfo-avatar" src="../../assets/images/defaultHead.png">
			        <div class='userName'>{{userName}}</div>
			        <div class='userName'>{{cellphone}}</div>
			    </div>
		    	<div class="stripInfo">
		    		<div  @click="toPassword"><i class="iconfont icon-xiugaimima" ></i><span>修改密码</span><i class="iconfont icon-xiangshang" ></i></div>
					<div @click="toChangeStartOrgnizationName">
						<i class="iconfont icon-xiugaimima" ></i><span>所属仓库</span> 
						<i style="float: right;" class="iconfont icon-xiangshang" ></i>
						<span style="float: right;">{{ $store.state.startOrgnizationName }}</span>
					</div>
					<div @click="checkVersion">
						<i style="margin-top: 12px" class="el-icon-refresh" ></i><span>版本更新</span> 
						<i style="float: right;" class="iconfont icon-xiangshang" ></i>
						<span style="float: right;">{{ $store.state.App_Version }}</span>
					</div>
		    	</div>
			    <div class='Exit_logon' >
				    <i class="iconfont icon-icon-yxj-switch-account"  @click="exit" ></i>
				    <div><span @click="exit">退出登录</span></div>
			    </div>
		 	</div>
		</div>
		<div class="SelectDelivery" v-if='ifShowDisableScan'>
			<div class="DeliveryBox">
				<div class="DeliveryBox_head">请选择扫描方式</div>
				<div class="DeliveryBox_content">
				<div @click='selectDisableScan("是")' :class="{DeliveryBox_content_active : ifDisableScan == '是'}"><span>巴枪扫描</span><i v-if='ifDisableScan=="是"' class="iconfont icon-duigou"></i></div>
				<div @click='selectDisableScan("否")' :class="{DeliveryBox_content_active : ifDisableScan == '否'}"><span>手机扫描</span><i v-if='ifDisableScan=="否"' class="iconfont icon-duigou"></i></div>
				</div>
			</div>
		</div>
		<el-dialog :visible.sync="ifShowStartOrgnizationName" width="85%" top="40vh" title="切换仓库">
			<div style="display:flex;">
				<div style="line-height: 38px; font-size: 20px;margin-right: 10px;">仓库:</div>
				<el-select v-model="address" placeholder="请选择地址" filterable remote :remote-method="getconsignesList" @change="changeAddress">
					<el-option v-for="item in consignesList" :key="item.address" :label="item.shortName" :value="item.id"></el-option>
				</el-select>
			</div>
			<span slot="footer" class="dialog-footer">
				<el-button @click="ifShowStartOrgnizationName = false">取 消</el-button>
				<el-button type="primary" @click="submitForm" >确 定</el-button>
			</span>
		</el-dialog>
		<FooterIndex/>
		<div v-if="ifTips" class="msg_tips">
			<div class="tips_content">
				<i class="iconfont icon-chenggong1"></i>
				<p>下载中<dot>...</dot></p>
			</div>
		</div>
		<div class="Navigate_MultiAddress" v-if="typeMShow">
			<div>
			<div class="SelectTitle">发现新版本，是否更新!</div>
			<div class="cancel" @click="selelctNo()">取消</div>
			<div class="cancel" @click="selectconfirm()">确认</div>
			</div>
		</div>
	</div>
</template>
<script type="text/javascript">
	import FooterIndex from '../../components/footer'
	export default {
		name: 'HomeIndex',
		data() {
			return {
				userName: '',
				cellphone: '', // 手机号码
				VersionNum: '', // 版本号
				iosorandroid: 'android', // android ios
				ifShowDisableScan: false,
				ifShowStartOrgnizationName: false,
        		ifDisableScan: '否',
				address: this.$store.state.startOrgnizationName,
				addressId: this.$store.state.userInfo.startOrgnizationId,
				consignesList: [],
				typeMShow: false,
				ifTips: false,
				versionInfo: {}
			}
		},
		components: {
			FooterIndex
		},
		created() {
			this.userName = this.$store.state.userInfo.userName;
			this.cellphone = this.$store.state.userInfo.cellphone;
			this.VersionNum = this.$store.state.App_Version;
			this.getconsignesList('')
		},
		mounted() {
			this.iosorandroid = this.$store.state.Device;
			this.ifDisableScan = this.getItem('SXJF_ifScan') || '否';
		},
		methods: {
			getconsignesList (address) {
				let that = this
				const params = {
					"address": address
				}
				this.httpRequest1('post', '/system/orgnization/getCangKuList', params).then((res) => {
					that.consignesList = res.data
				})
			},
			changeAddress (id) {
				console.log(id)
				this.addressId = id
			},
			submitForm () {
				if (this.addressId != this.$store.state.userInfo.startOrgnizationId) {
					const params = {
						"startOrgnizationId": this.addressId,
						"userId": this.$store.state.userInfo.id,
					}
					let that = this
					this.httpRequest1('post', '/system/user/updateUserStartOrgnizationId', params).then((res) => {
						that.ifShowStartOrgnizationName = false
						that.address = that.consignesList.filter(ele => { return ele.id == that.addressId})[0].shortName
						console.log(that.address, 'that.address')
						that.$store.state.startOrgnizationName = that.address
						that.$store.state.userInfo.startOrgnizationId = that.addressId
						// console.log(that.consignesList.filter(ele => { return ele.id == that.addressId}), 'that.consignesList', that.consignesList, that.addressId)
						
					})
				} else {
					this.ifShowStartOrgnizationName = false
				}
			},
			// 更新app
			updateapp() {
				// 安卓
				try {
					CallAndroidOrIOS.updateAPP();
				}
				catch(error) {}
				// 苹果
				try {
				  window.webkit.messageHandlers.messageSend.postMessage({a: '检查版本更新'})
				}
				catch(err) {}
			},
			show_DisableScan() {
				this.ifShowDisableScan = true;
			},
			// 选择是否禁用app扫描框
			selectDisableScan(ifvalue) {
				this.ifDisableScan = ifvalue;
				this.setItem({
					name: 'SXJF_ifScan',
					value: ifvalue,
				})
				this.ifShowDisableScan = false;
			},
			// 跳转到 修改密码 页面
			toPassword() {
				this.$router.push({
					name: 'RePassword'
				})
			},
			// 跳转到 历史轨迹 页面
			toChangeStartOrgnizationName() {
				this.ifShowStartOrgnizationName = true
			},
			// 切换账号 按钮
			exit() {
				let that = this;
				this.$confirm('确定要退出登录吗?', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					localStorage.removeItem('SXJF_USERDATA_second');
					localStorage.removeItem('SXJF_pwd_second');
					that.pluginGetUser('', '');
					that.$store.state.AviationWaybill.Waybill_SearchData = '';
					that.$store.state.AviationWaybill.Waybill_SearchType = 0;
					that.$store.state.Aviation_HistoryWaybill.Waybill_SearchData = '';
					that.$store.state.Aviation_HistoryWaybill.Waybill_SearchType = 0;
					that.$store.state.Waybill.Waybill_SearchData = '';
					that.$store.state.Waybill.Waybill_SearchType = 0;
					that.$router.push({
						name: 'Login'
					})
				}).catch(() => {});
			},
			// 传手机号 记录轨迹
			pluginGetUser(u, p) {
				// 安卓 传手机号 记录轨迹
				try {
					CallAndroidOrIOS.callAndroidTrack( u, p);
				}
				catch(error) {}
				// 苹果
				try {
					window.webkit.messageHandlers.messageSend.postMessage({a: '记住帐号密码',b: u,c: p})
				}
				catch(error) {}
			},
			checkVersion () {
				var postData = {
					types: 'android'
				};
				var that = this
				this.httpRequest1('post', '/system/appVersion/queryAppVersion', {"types": 'android'}).then(res => {
					if (res.data.versionNo != that.$store.state.App_Version) {
						that.typeMShow = true
						that.versionInfo = res.data
						that.$store.state.isFirstInApp = false
					} else {
						that.$message({
							message: '当前APP为最新版本',
							type: 'success'
						});
					}
					// that.userList = res.data
				})
			},
			selectconfirm () {
				this.typeMShow = false
				CallAndroidOrIOS.UpDateApp(this.versionInfo.downloadUrl);
			},
			selelctNo () {
				this.typeMShow = false
			},
		}
	}
</script>
<style lang="less" scoped>
  @import "../../components/publicLess.less";
	.HomeIndex{
		height: 100%;
		overflow: hidden;
		background-color: #F4F4F4;
		.container{
			margin-top: 0;
			overflow: hidden;
			height: 100%;
			background-color: #F4F4F4;
			.headImg{
			    width: 100%;
			    height: 100%;
			    overflow: scroll;
			    position: relative;
			    font-size: 26/50rem;
			  	.userName{
				  font-size: 38/50rem;
				  color:  @PublicColor;
				  text-align: center;
				  margin-bottom: 40/50rem;
				}
				.background{
				  width:100%;
				  height: 350/50rem;
				  background: linear-gradient(to bottom, @PublicColor, #05A0DD);
				}
				.background_blank{
				  width: 650/50rem;
				  height: 350/50rem;
				  position: absolute;
				  top:150/50rem;
				  left: 50/50rem;
				  background-color: #fff;
				  z-index: 33;
				  border-radius: 10/50rem;
				}
				.head{
				  width:100%;
				  height: 350/50rem;
				  position: absolute;
				  left: 0/50rem;
				  z-index: 95;
				  top: 75/50rem;
				}
				.userinfo-avatar{
				  width: 150/50rem;
				  height: 150/50rem;
				  border-radius: 50%;
				  display: block;
				  margin: 0 auto 40/50rem;
				}
				.stripInfo{
					margin-top: 200/50rem;
					font-size: 30/50rem;
					&>div{
						width: 100%;
						height: 80/50rem;
						line-height: 80/50rem;
						background-color: #fff;
						margin-bottom: 14/50rem;
						box-sizing: border-box;
						overflow: hidden;
						&>i:nth-child(1){
						  float: left;
						  width: 86/50rem;
						  text-align: center;
						  color:  @PublicColor;
						  font-size: 42/50rem;
						  &.icon-iconsonghuofangshi{
						  	font-size: 69/50rem;
						  }
						  &.icon-xiugaimima{
							font-size: 44/50rem;
						  }
						  &.icon-guanyu{
						  	font-size: 46/50rem;
						  }
						}
						&>i:nth-child(3),&>span:nth-child(4),&>span:nth-child(3){
							float: right;
							margin-right: 20/50rem;
							color: #777;
						}
						&>span:nth-child(3){
							margin-right: 30/50rem;
						}
					}
				}
				///* 切换账号 */
				.Exit_logon{
				  	margin-top: 50/50rem;
				  	&>i{
					 	display: block;
					 	margin: 0 auto;
					 	width: 114/50rem;
					 	font-size: 114/50rem;
					 	color:  @PublicColor;
					}
					&>div{
					  text-align: center;
					  color:  @PublicColor;
					  font-size: 28/50rem;
					  margin-top: 10/50rem;
					}
				}
			}
		}
	}
</style>